<template>
  <div class="pic">
    <h3>{{ piclistdetail[0].title }}</h3>
    <p>
      <span
        >发表时间：{{
          piclistdetail[0].add_time | dateformat("YYYY-MM-DD HH:mm:ss")
        }}</span
      >
      <span>点击：{{ piclistdetail[0].click }}次</span>
    </p>
    <hr />

    <!-- 缩略图 -->
    <div class="thumb-img-list">
      <img :src="item.src" v-for="(item, i) in picsmall" :key="i" />
    </div>
    <div class="content" v-html="piclistdetail[0].content"></div>
    <comment :newsid="id"></comment>
  </div>
</template>
<script>
import { piclistdetail, sulvetu } from "../../../static/api.js";
import comment from "../../components/comment";
export default {
  data() {
    return {
      piclistdetail: [{}],
      picsmall: [{}],
    };
  },
  async created() {
    this.piclistdetail = await piclistdetail(this.id);
    this.picsmall = await sulvetu(this.id);
    console.log(this.picsmall);
  },

  components: {
    comment,
  },
  props: ["id"],
};
</script>
<style lang="scss" scoped>
.pic {
  margin: 0 5px 51px;
  .content {
    text-align: left;
  }
  .thumb-img-list {
    img {
      width: 100px;
    }
  }
}
</style>
